<template>
    <div class="add_mian">
        <div class="add_row">
            <div class="row_mian">
<!--                <div class="row_left">-->
<!--                    <el-steps-->
<!--                            direction="vertical"-->
<!--                            :active="active"-->
<!--                            finish-status="success"-->
<!--                    >-->
<!--                        <el-step-->
<!--                                title="一、展位信息确认"-->
<!--                                :icon="active > 0 ? 'el-icon-check' : ''"-->
<!--                        ></el-step>-->
<!--                        <el-step-->
<!--                                title="二、展位基本信息"-->
<!--                                :icon="active > 1 ? 'el-icon-check' : ''"-->
<!--                        ></el-step>-->
<!--                        <el-step-->
<!--                                title="三、搭建商信息"-->
<!--                                :icon="active > 2 ? 'el-icon-check' : ''"-->
<!--                        ></el-step>-->
<!--                        <el-step-->
<!--                                title="四、审图资料上传"-->
<!--                                :icon="active > 3 ? 'el-icon-check' : ''"-->
<!--                        ></el-step>-->
<!--                        <el-step-->
<!--                                title="报图结束"-->
<!--                                :icon="active > 4 ? 'el-icon-check' : ''"-->
<!--                        ></el-step>-->
<!--                    </el-steps>-->
<!--                </div>-->
                <div class="row_right">
                    <zwxx
                            @deletenext="deletenext"
                            @hanldnext="hanldnext"
                            v-if="active == 0"
                    ></zwxx>
                    <keep-alive include="keepAlive.join(',')">

                        <zwjbxx @hanldnext="hanldnext" v-if="active == 1"></zwjbxx>
                        <djsxx @hanldnext="hanldnext" v-if="active == 2"></djsxx>
                        <edit :appid="appid" @hanldnext="hanldnext"  v-if="active == 3"></edit>
                        <btjs @hanldnext="hanldnext" v-if="active == 4"></btjs>
                    </keep-alive>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import zwxx from "../../components/outfit/drawing/add/zwxx.vue";
    import djsxx from "../../components/outfit/drawing/add/djsxx.vue";
    import zwjbxx from "../../components/outfit/drawing/add/zwjbxx.vue";
    import edit from "../../components/outfit/drawing/add/edit.vue";
    import btjs from "../../components/outfit/drawing/add/btjs.vue";
    export default {
        components: {
            djsxx,
            zwxx,
            zwjbxx,
            edit,
            btjs,
        },
        data() {
            return {
                bool:false,
                active: 0,
                appid:0,
                keepAlive: ["step2", "step3", "step4", "step5"],
            };
        },
        activated() {
            console.log('w1');
            let jdactive = this.$route.query.index;
            this.appid = this.$route.query.applyid
            if (jdactive) {
                this.active = jdactive - 1;
            } else {
                this.active = 0;
            }
        },
        created(){
            this.appid = this.$route.query.applyid
        },
        methods: {
            hanldnext(val) {
                this.active = val;
            },
            deletenext(){
                this.keepAlive = []
            }
        },
    };
</script>
<style scoped>
    .add_mian {
        padding: 40px;
    }
    .add_row {
        margin: auto;
        width: 70%;
    }
    /deep/.el-step__icon.is-text {
        display: none !important;
    }
    /deep/.el-step.is-vertical .el-step__line {
        width: 0;
    }
    .row_mian {
        display: flex;
    }
    .row_left {
        flex: 1;
        padding: 20px 0;
        height: 200px;
        background-color: #fff;
    }
    .row_right {
        flex: 4;
        background-color: #fff;
        margin-left: 20px;
    }
</style>